Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: report when player state is error #26989

Merged
merged 24 commits into from
Dec 18, 2024

Conversation

pauldambra
Copy link
Member

@pauldambra pauldambra commented Dec 17, 2024

  • let's capture an event when we show an error
  • reduce the likelihood we'll show an error unnecessarily
  • *fly-by improvements to the toolbar's event debugger cos i was using it to figure this out
  • don't overreport some settings changes
Screenshot 2024-12-17 at 19 45 42

Copy link
Contributor

github-actions bot commented Dec 17, 2024

Size Change: +2.9 kB (+0.26%)

Total Size: 1.11 MB

Filename Size Change
frontend/dist/toolbar.js 1.11 MB +2.9 kB (+0.26%)

compressed-size-action

@posthog-bot
Copy link
Contributor

📸 UI snapshots have been updated

5 snapshot changes in total. 0 added, 5 modified, 0 deleted:

Triggered by this commit.

👉 Review this PR's diff of snapshots.

@posthog-bot
Copy link
Contributor

📸 UI snapshots have been updated

2 snapshot changes in total. 0 added, 2 modified, 0 deleted:

  • chromium: 0 added, 2 modified, 0 deleted (diff for shard 1)
  • webkit: 0 added, 0 modified, 0 deleted

Triggered by this commit.

👉 Review this PR's diff of snapshots.

@pauldambra pauldambra requested a review from a team December 17, 2024 20:39
@@ -1018,7 +1018,7 @@ export const sessionRecordingPlayerLogic = kea<sessionRecordingPlayerLogicType>(
cache.pausedMediaElements = values.endReached ? [] : playingElements
},
restartIframePlayback: () => {
cache.pausedMediaElements.forEach((el: HTMLMediaElement) => el.play())
cache.pausedMediaElements?.forEach((el: HTMLMediaElement) => el.play())
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

saw an error from trying to access this when it was undefined while debugging the rest of this

@@ -167,7 +189,13 @@ export const EventDebugMenu = (): JSX.Element => {
</div>
</ToolbarMenu.Body>
<ToolbarMenu.Footer noPadding>
<SettingsBar border="top" className="justify-end">
<SettingsBar border="top" className="justify-between">
<SettingsMenu
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

found myself needing this while figuring out the rest of this

@@ -441,8 +441,6 @@ export const eventUsageLogic = kea<eventUsageLogicType>([
reportRecordingsListPropertiesFetched: (loadTime: number) => ({ loadTime }),
reportRecordingsListFilterAdded: (filterType: SessionRecordingFilterType) => ({ filterType }),
reportRecordingPlayerSeekbarEventHovered: true,
reportRecordingPlayerSpeedChanged: (newSpeed: number) => ({ newSpeed }),
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

i hate this gigantic logic that just hides calling posthog capture

@@ -122,4 +123,13 @@ export const playerSettingsLogic = kea<playerSettingsLogicType>([
(preferredSidebarStacking) => preferredSidebarStacking === SessionRecordingSidebarStacking.Vertical,
],
}),

listeners({
setSpeed: ({ speed }) => {
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

moved these captures closer to the source

@@ -848,9 +842,10 @@ export const sessionRecordingPlayerLogic = kea<sessionRecordingPlayerLogicType>(
startScrub: () => {
actions.stopAnimation()
},
setSpeed: ({ speed }) => {
actions.reportRecordingPlayerSpeedChanged(speed)
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

there are always three instances of the player logic, all three are listening to the player settings logic, so all three were reporting this making usage look higher than it is... luckily not an important metric

@@ -1143,6 +1138,16 @@ export const sessionRecordingPlayerLogic = kea<sessionRecordingPlayerLogicType>(
actions.reportMessageTooLargeWarningSeen(values.sessionRecordingId)
}
},
currentPlayerState: (prev, next) => {
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

pretty sure we're setting this more than we need to, but this at least can report on that too high a number

@posthog-bot
Copy link
Contributor

📸 UI snapshots have been updated

1 snapshot changes in total. 0 added, 1 modified, 0 deleted:

  • chromium: 0 added, 1 modified, 0 deleted (diff for shard 1)
  • webkit: 0 added, 0 modified, 0 deleted

Triggered by this commit.

👉 Review this PR's diff of snapshots.

@pauldambra pauldambra changed the title feat: report when player state is error fix: report when player state is error Dec 17, 2024
@pauldambra pauldambra enabled auto-merge (squash) December 18, 2024 08:30
@posthog-bot
Copy link
Contributor

📸 UI snapshots have been updated

1 snapshot changes in total. 0 added, 1 modified, 0 deleted:

  • chromium: 0 added, 1 modified, 0 deleted (diff for shard 2)
  • webkit: 0 added, 0 modified, 0 deleted

Triggered by this commit.

👉 Review this PR's diff of snapshots.

@pauldambra pauldambra disabled auto-merge December 18, 2024 11:54
@posthog-bot
Copy link
Contributor

📸 UI snapshots have been updated

1 snapshot changes in total. 0 added, 1 modified, 0 deleted:

  • chromium: 0 added, 1 modified, 0 deleted (diff for shard 2)
  • webkit: 0 added, 0 modified, 0 deleted

Triggered by this commit.

👉 Review this PR's diff of snapshots.

@@ -59,26 +59,6 @@ function URLOrScreen({ lastUrl }: { lastUrl: string | undefined }): JSX.Element
)
}

function PlayerWarningsRow(): JSX.Element | null {
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

we don't set these anywhere any more. so we don't need this code

@@ -82,7 +82,7 @@ function ShowMouseTail(): JSX.Element {

return (
<SettingsToggle
title="Show mouse tail"
title="Show a tail following the cursor to make it easier to see"
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

various changes to ensure there are tooltips on buttons

</div>
<InspectDOM />
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

and to separate the inspect dom button from the player buttons

Comment on lines +154 to +155
setPlayerError: (reason: string) => ({ reason }),
clearPlayerError: true,
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

"show" didn't really mean show, so now we store the reason and have a clear action

const isStillLoading = values.isRealtimePolling || values.snapshotsLoading
const isPastEnd = values.sessionPlayerData.end && timestamp > values.sessionPlayerData.end.valueOf()
if (isStillLoading) {
const isPastEnd = values.sessionPlayerData.end && timestamp >= values.sessionPlayerData.end.valueOf()
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

the logic in here confuses me... and generally when this shows an error it doesn't need to...

let's remove the error state and see if the real reason crops up, then fix the thing we understand

@posthog-bot
Copy link
Contributor

📸 UI snapshots have been updated

1 snapshot changes in total. 0 added, 1 modified, 0 deleted:

  • chromium: 0 added, 1 modified, 0 deleted (diff for shard 2)
  • webkit: 0 added, 0 modified, 0 deleted

Triggered by this commit.

👉 Review this PR's diff of snapshots.

@pauldambra pauldambra enabled auto-merge (squash) December 18, 2024 14:00
@posthog-bot
Copy link
Contributor

📸 UI snapshots have been updated

1 snapshot changes in total. 0 added, 1 modified, 0 deleted:

  • chromium: 0 added, 1 modified, 0 deleted (diff for shard 2)
  • webkit: 0 added, 0 modified, 0 deleted

Triggered by this commit.

👉 Review this PR's diff of snapshots.

Comment on lines -161 to -163
const lessThanFiveMinutesOld = dayjs().diff(start, 'minute') <= 5
const cannotPlayback = snapshotsInvalid && lessThanFiveMinutesOld && !messageTooLargeWarnings

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

giving this a better name

@pauldambra pauldambra disabled auto-merge December 18, 2024 15:27
@pauldambra pauldambra merged commit 2f9e896 into master Dec 18, 2024
98 of 99 checks passed
@pauldambra pauldambra deleted the feat/pd/report-when-player-state-is-error branch December 18, 2024 15:28
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants